/**
 * Created by zwq on 2017/6/27 0027.
 */

$(function(){
    new chartFu();
});

function chartFu(){
    this.init();
}

chartFu.prototype={
    init:function(){
        this.ChartLine(); //折线图
        this.ChartBar();//柱状图
        this.ChartRadar();//雷达/蜘蛛网图数据结构
        this.CharDataPolararea();//极地区域图数据结构
        this.CharDataPie();//饼图数据结构
        this.CharDataDoughnut(); //环形图数据结构

        window.onload=function(){
            //折线图
            var ctxLine=document.getElementById("myChartLine").getContext("2d");
            window.myBar=new Chart(ctxLine).Line(barCharDataLine,{
                responsive:true
            });

            var ctxBar = document.getElementById("myChartBar").getContext("2d");
            window.myBar=new Chart(ctxBar).Bar(barCharData,{
                responsive:true
            });

            var ctxRadar = document.getElementById("myChartRadar").getContext("2d");
            window.myBar=new Chart(ctxRadar).Radar(barCharDataRadar,{
                responsive:true
            });

            //极地区域图
            var ctxPolararea = document.getElementById("myChartPloararea").getContext("2d");
            window.myBar=new Chart(ctxPolararea).PolarArea(barCharDataPolararea,{
                responsive:true
            });

            //饼图
            var ctxpie = document.getElementById("myChartPie").getContext("2d");
            window.myBar=new Chart(ctxpie).Pie(barCharDataPie,{
                responsive:true
            });

            //饼图
            var ctxdoughnut = document.getElementById("myChartDoughnut").getContext("2d");
            window.myBar=new Chart(ctxdoughnut).Doughnut(barCharDataDoughnut,{
                responsive:true
            });

        };

    },
    ChartLine:function(){
        //折线图数据结构
        return barCharDataLine={
            labels:["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月"],
            datasets:[
                {
                    fillColor : "rgba(45,195,232,0.5)",
                    strokeColor : "rgba(45,195,232,1)",
                    pointColor : "rgba(45,195,232,1)",
                    pointStrokeColor : "#fff",
                    data : [1,8,5,2,7,4,9,5,1,7,4,2]
                },
                {
                    fillColor : "rgba(160,212,104,0.5)",
                    strokeColor : "rgba(160,212,104,1)",
                    pointColor : "rgba(160,212,104,1)",
                    pointStrokeColor : "#fff",
                    data : [6,2,5,2,1,1,2,6,3,5,3,9]
                }
            ]
        };
    },
    ChartBar:function(){
        //柱状图数据结构
        return barCharData={
            labels:["1","2","3","4","5","6","7","8","9","10","11","12"],
            datasets : [
                {
                    fillColor : "rgba(255,206,86,0.5)",
                    strokeColor : "rgba(255,206,86,1)",
                    pointColor : "rgba(255,206,86,1)",
                    pointStrokeColor : "#fff",
                    data : [1,8,5,2,7,4,9,5,1,7,4,2]
                },
                {
                    fillColor : "rgba(251,110,82,0.5)",
                    strokeColor : "rgba(251,110,82,1)",
                    pointColor : "rgba(251,110,82,1)",
                    pointStrokeColor : "#fff",
                    data : [6,2,5,2,1,1,2,6,3,5,3,9]
                }
            ]
        }


    },
    ChartRadar:function(){
        return barCharDataRadar={
            labels:["1","2","3","4","5","6","7","8","9","10","11","12"],
            datasets:[
                {
                    fillColor : "rgba(231,91,144,0.5)",
                    strokeColor : "rgba(231,91,144,1)",
                    pointColor : "rgba(231,91,144,1)",
                    pointStrokeColor : "#fff",
                    data : [1,8,5,2,7,4,9,5,1,7,4,2]
                },
                {
                    fillColor : "rgba(45,195,232,0.5)",
                    strokeColor : "rgba(45,195,232,1)",
                    pointColor : "rgba(45,195,232,1)",
                    pointStrokeColor : "#fff",
                    data : [6,2,5,2,1,1,2,6,3,5,3,9]
                }
            ]
        };



    },
    CharDataPolararea:function(){
        //极地区域图数据结构
        return barCharDataPolararea=[
            {
                value : 30,
                color: "#2dc3e8"
            },
            {
                value : 90,
                color: "#a0d468"
            },
            {
                value : 24,
                color: "#7D4F6D"
            },
            {
                value : 58,
                color: "#ffce55"
            },
            {
                value : 82,
                color: "#e75b8d"
            },
            {
                value : 8,
                color: "#fb6e52"
            }
        ];

    },
    CharDataPie:function(){
        return barCharDataPie=[
            {
                value: 30,
                color:"#a0d468"
            },
            {
                value : 50,
                color : "#e75b8d"
            },
            {
                value : 100,
                color : "#2dc3e8"
            }
        ];

    },
    CharDataDoughnut:function(){
        return barCharDataDoughnut=[
            {
                value: 30,
                color:"#F38630"
            },
            {
                value : 50,
                color : "#E0E4CC"
            },
            {
                value : 100,
                color : "#a0d468"
            }
        ];

    }
};